<!--
 * @Descripttion: 今日劳动力作业概况
 * @version: 
 * @Author: ada.wu
 * @Date: 2025-06-25 23:48:14
 * @LastEditors: ada.wu
 * @LastEditTime: 2025-07-17 23:16:46
-->
<style>
    .layui-card-header {
        border-bottom: none;
    }

    .layui-card.selected {
        background-color: var(--primary-hover-color) !important;
    }

    .layui-card.selected.solid::after {
        border-color: var(--primary-color) !important;
        ;

    }

    #grid-card {
        height: calc(100vh - 500px);
    }

    .total-map {
        height: calc(100vh - 355px);
    }
</style>
<div class="layuimini-page-anim">
    <div class="layui-bg-white">
        <div class="p-5">
            <div class="solid ">
                <div class="layui-row">
                    <div class="layui-col-md7 p-4">
                        <div class="layui-row mb-5">
                            <div class="layui-col-xs12 mt-3">
                                <div class="flex flex-between">
                                    <div>
                                        <label class="layui-font-gray">设备离线告警：</label>
                                        <span class="layui-font-black">周期性计划</span>
                                    </div>
                                    <div class="layui-font-red">
                                        待处理
                                    </div>

                                </div>

                            </div>
                            <div class="layui-col-xs12 mt-3">
                                <label class="layui-font-gray">2025-07-17
                                    22:04:36北京海淀上地街道项目上地街道记录仪0365（864504040800365）执法仪设备离线告警
                                </label>
                            </div>
                            <div class="layui-col-xs12 mt-3">
                                <label class="layui-font-gray">报事设备：</label>
                                <span class="layui-font-black">记录仪</span>
                                <label class="layui-font-gray">0365585649972065797</label>
                            </div>
                            <div class="layui-col-xs12 mt-3">
                                <label class="layui-font-gray">上报时间： </label>
                                <span class="layui-font-black">2025-07-17 22:04:36</span>
                            </div>
                            <div class="layui-col-xs12 mt-3">
                                <label class="layui-font-gray">报事位置（GPS位置）：</label>
                                <span class="layui-font-black">--</span>
                            </div>

                        </div>
                        <b class="m-4">图片/视频</b>
                        <div class="y-scroll" id="grid-card">


                        </div>

                    </div>
                    <div class="layui-col-md5 solid-left">
                        <div class="layui-form layuimini-form mt-5 pr-5">
                            <div class="layui-form-item">
                                <label class="layui-form-label required">受理方式</label>
                                <div class="layui-input-block">
                                    <select class="layui-input" lay-append-to="body" placeholder="请选择"
                                        name="businessNames" lay-search>
                                        <option value="1">暂不受理</option>
                                        <option value="2">同步给第三方处理</option>
                                        <option value="3">派发工单</option>
                                        <option value="4">误报</option>
                                        <option value="5">重复预警已处理</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label required">报事原因</label>
                                <div class="layui-input-block">
                                    <div class="flex">
                                        <div style="width: 90px;" class="mr-5">
                                            <select class="layui-input" lay-append-to="body" placeholder="请选择"
                                                name="businessNames" lay-search>
                                                <option value="1">级联</option>
                                                <option value="2">搜索</option>
                                            </select>
                                        </div>
                                        <div>
                                            <select class="layui-input" lay-append-to="body" placeholder="请选择"
                                                name="businessNames" lay-search>
                                                <option value="1">暂不受理</option>
                                                <option value="2">同步给第三方处理</option>
                                                <option value="3">派发工单</option>
                                                <option value="4">误报</option>
                                                <option value="5">重复预警已处理</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label required">关联作业位置</label>
                                <div class="layui-input-block">
                                    <div class="flex">
                                        <div style="width: 90px;" class="mr-5">
                                            <select class="layui-input" lay-append-to="body" placeholder="请选择"
                                                name="businessNames" lay-search>
                                                <option value="1">级联</option>
                                                <option value="2">搜索</option>
                                            </select>
                                        </div>
                                        <div>
                                            <select class="layui-input" lay-append-to="body" placeholder="请选择"
                                                name="businessNames" lay-search>
                                                <option value="1">暂不受理</option>
                                                <option value="2">同步给第三方处理</option>
                                                <option value="3">派发工单</option>
                                                <option value="4">误报</option>
                                                <option value="5">重复预警已处理</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label required">任务描述</label>
                                <div class="layui-input-block">
                                    <textarea name="remark" class="layui-textarea" placeholder="请输入任务描述"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label required">派发方式</label>
                                <div class="layui-input-block">
                                    <input type="radio" name="sex" value="派发至责任组织" title="派发至责任组织" checked="">
                                    <input type="radio" name="sex" value="派发至指定人员" title="派发至指定人员">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label required">指定人员</label>
                                <div class="layui-input-block">
                                    <input type="text" name="work" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">工单来源</label>
                                <div class="layui-input-block">
                                    <select class="layui-input" lay-append-to="body" placeholder="请选择"
                                        name="businessNames" lay-search>
                                        <option value="1">舆情</option>
                                        <option value="4">其他</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">部件</label>
                                <div class="layui-input-block">
                                    <select class="layui-input" lay-append-to="body" placeholder="请选择"
                                        name="businessNames" lay-search>
                                        <option value="1">舆情</option>
                                        <option value="4">其他</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">坐标</label>
                                <div class="layui-input-block">
                                    <input type="email" name="email" placeholder="请输入邮箱" value="" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">开始时间</label>
                                <div class="layui-input-block">
                                    <input type="text" name="datePeriodStart" autocomplete="off" id="date_period_start"
                                        class="layui-input" placeholder="请选择">

                                </div>
                            </div>
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">配备工具</label>
                                <div class="layui-input-block">
                                    <select class="layui-input" lay-append-to="body" placeholder="请选择"
                                        name="businessNames" lay-search>
                                        <option value="1">舆情</option>
                                        <option value="4">其他</option>
                                    </select>
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn layui-btn-normal" lay-submit
                                        lay-filter="saveBtn">确认保存</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>



        </div>
    </div>
</div>

<script>



    layui.use(['form', 'miniPage', 'miniAMap'], function () {
        var $ = layui.$,
            element = layui.element,
            layer = layui.layer,
            form = layui.form,
            laydate = layui.laydate,
            util = layui.util;
        /**
         * 初始化表单，要加上，不然刷新部分组件可能会不加载
         */
        form.render();
        laydate.render({
            elem: '#date_period_start', // 绑定元素
            type: 'date', // 日期模式，可选：year/month/date/datetime 等
            format: 'yyyy-MM-dd', // 日期格式
            closeStop: '#date_period_start', // 点击输入框不关闭面板
            done: function (value, date) {
                console.log('选中的日期:', value); // 输出格式如：2025-07-01
                console.log('日期对象:', date); // 包含 year、month、date 等信息
                // 可在此处执行其他操作，例如请求数据等
            }
        })
        // 当前弹出层，防止ID被覆盖
        var parentIndex = layer.index;

        //监听提交
        form.on('submit(saveBtn)', function (data) {
            var index = layer.alert(JSON.stringify(data.field), {
                title: '最终的提交信息'
            }, function () {

                // 关闭弹出层
                layer.close(index);
                layer.close(parentIndex);

            });


            return false;
        });



    })
</script>